{% include 'header.html' %}
<div class="cont">
{% include 'nav.html' %}
    {% block body %}
        <!-- contents -->
        <div class="articles ui-container t-item" id="content">
            <ul class="ui-list ui-list-pure  ">
                {% for i in dst %}
                <li class="ui-border-b" type="false">
                    <div class="item-list-c">
                        <article>
                            <!-- user -->
                            <section class="new_user">
                                <div class="ui-row-flex list-user-author">
                                    <div class="ui-avatar item-user" style="touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
                                        <img src="{{ i.header }}"
                                        data-url="{{ i.header }}">
                                    </div>
                                    <div class="ui-list-info">
                                        <h4 class="ui-nowrap">{{ i.name }}</h4>
                                    </div>
                                </div>
                            </section>
                            <!-- title -->
                            <section class="ui-row-flex">
                                <p>{{ i.title }}</p>
                            </section>
                            <!-- content -->
                            <section class="ui-placehold ui-placehold-img topic-img">
                                <img src="{{ i.image }}"
                                     class="j-imglazyload"
                                     data-url="{{ i.image }}">
                            </section>
                            <!--tool bar-->
                            <div class="ui-row-flex item-tool">
                                <ul class="ui-tiled" data-tid="0000" data-playcount="0" data-playfcount="0">
                                    <li class="tool-button">
                                        <a class="ui-border-r tool-praise" style="touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
                                            <i class="ui-icon-praise"></i>
                                            <span>{{ i.love }}</span>
                                        </a>
                                    </li>
                                    <li class="tool-button">
                                        <a class="ui-border-r tool-cai" style="touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
                                            <i class="ui-icon-cai"></i>
                                            <span>{{ i.hate }}</span>
                                        </a>
                                    </li>
                                    <li class="tool-button j-ga" style="touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
                                        <a class="ui-border-r  tool-forward" style="touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
                                            <i class="ui-icon-f"></i>
                                            <span>{{ i.forward }}</span>
                                        </a>
                                    </li>
                                    <li class="tool-button">
                                        <a class="tool-comments" href="/{{ i.id }}.html" style="touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
                                            <i class="ui-icon-comments"></i>
                                            <span>详细</span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </article>
                    </div>
                </li>
                {% endfor %}
            </ul>
        {% include 'foot_page.html' %}
        </div>
    {% endblock body %}
{% include 'footer.html' %}
</div>

